import React from 'react';
import {useParams,useHistory,useLocation,useRouteMatch} from 'react-router-dom'
import {Button} from 'antd'

const RouterTestHook = (props) => {
    console.log('RouterTestHook props1', props);
    const routerParams=useParams();
    console.log('RouterTestHook routerParams', routerParams);

    const history=useHistory();
    console.log('RouterTestHook history', history);

    const location=useLocation();
    console.log('RouterTestHook useLocation', location);

    const routeMatch=useRouteMatch();
    console.log('RouterTestHook useRouteMatch', routeMatch);

    const {someProp} = props;

    const goPage = () => {
        console.log('/child/:id/grand-child')
        history.push('/child/1/grand-child')
    };

    return (
        <div>
            <Button onClick={goPage}>Grandhook</Button>
            <div>{someProp}</div>
        </div>
    );
};

export default RouterTestHook
